<!-- SFC方式 单文件组件single file component -->
<template>
  <el-table :data="tableData" @selection-change="handleSelectionChange" style="width: 100%">
    <el-table-column type="selection" width="55" v-if="showSelection" />
    <template v-for="(item, index) in tableHeader">
      <!-- 是一个图片 -->
      <el-table-column v-if="item.type === 'img'" :label="item.title" :prop="item.key" :min-width="item.minWidth">
        <template #default="scope">
          <img :src="scope.row.slide" :alt="item.title" style="width: 50px; height: auto" />
        </template>
      </el-table-column>
      <!--展示的数据是用户可操作列: 具名插槽 -->
      <slot v-else-if="item.slot" :name="item.slot" />
      <el-table-column v-else :label="item.title" :prop="item.key" :min-width="item.minWidth"></el-table-column>
    </template>



    <!-- <el-table>
      <el-table-column label="编号" prop="id" min-width="60"></el-table-column>
      <el-table-column label="开始时间" prop="id" min-width="60"></el-table-column>
      <el-table-column label="持续时间" prop="id" min-width="60"></el-table-column>
      <el-table-column label="幻灯片" :prop="item.key" :min-width="item.minWidth">
        <template #default="scope">
          <img :src="scope.row.slide" :alt="item.title" style="width: 50px; height: auto" />
        </template>
      </el-table-column>
      <slot name="status" />
      <el-table-column label="编号" prop="id" min-width="60"></el-table-column>
      <slot name="action" />


    </el-table> -->


    <!-- <el-table-column label="开启时间(整点)" prop="time" width="180"></el-table-column>
    <el-table-column label="持续时间(整数小时)" prop="continued" width="180"></el-table-column>
   

<el-table-column label="排序" prop="sort" width="180"></el-table-column>
 -->
  </el-table>
</template>
<script setup>
/**
 * 模块引入
 */
import { reactive, ref } from 'vue';
const emit = defineEmits(["sendIds"])
/**
 * 数据
 */
defineProps({
  tableData: {
    type: Array,

  },
  tableHeader: {
    type: Array,
  },
  showSelection: {
    type: Boolean,
    default: false
  }
});

/**
 * 状态
 */
/**
 * 功能方法
 */
const handleSelectionChange = (val) => {
  // multipleSelection.value = val
  var ids = val.map((item) => { return item.id })
  console.log("子组件", ids)
  emit("sendIds", ids)
}

</script>
<style lang='scss' scoped>
.page-container {}
</style>